<template>
  <div>
    <MainHeader style="z-index: 10" />
    <div class="page-container">
      <router-view></router-view>
    </div>
    <DialogBox />
    <MainFooter />
  </div>
</template>

<script>
import MainFooter from '@/components/Footer.vue'
import MainHeader from '@/components/CustomHeader.vue'
import DialogBox from '@/components/MenuDialog.vue'

export default {
  name: 'Home',
  components: {
    MainHeader,
    MainFooter,
    DialogBox
  },
  watch: {
    $route: function (to, from) {
      document.body.scrollTop = 0
      document.documentElement.scrollTop = 0
    }
  }
}
</script>

<style lang="scss">
@import './assets/style/common';

.page-container {
  position: relative;
  padding-top: 80px;
  min-height: calc(100vh - 257px);
}
</style>
